<!DOCTYPE HTML>
<html>

<head>
	<meta charset="utf-8">
	<meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0" />
	<meta name="format-detection" content="telephone=no,email=no,date=no,aItemress=no">
	<title>我的</title>
	<link rel="stylesheet" type="text/css" href="../css/base.css" />
	<style type="text/css">
		.bg-my {
			background: #005A93;
		}

		.navbar {
			width: 100%;
			height: 0.84rem;
			background: #005a93;
			padding-top: 0.1rem;
			box-sizing: border-box;
			position: relative;
		}

		.navbar .title {
			font-size: 0.18rem;
			font-weight: 500;
			color: rgba(255, 255, 255, 1);
			line-height: 0.28rem;
			text-align: center;
		}

		.news-tip {
			position: absolute;
			right: 0.15rem;
			top: 0.09rem;
		}

		.news-wraper img {
			width: 0.22rem;
			height: 0.22rem;
		}

		.red-tips {
			position: absolute;
			right: -0.04rem;
			top: -0.04rem;
			width: 0.08rem;
			height: 0.08rem;
			border-radius: 50%;
			background: rgba(251, 0, 0, 1);
		}

		.user-info {
			width: 3.45rem;
			height: 0.94rem;
			background: rgba(255, 255, 255, 1);
			box-shadow: 0px 0.06rem 0.13rem 0px rgba(0, 0, 0, 0.06);
			margin: 0 auto;
			margin-top: -0.38rem;
			position: relative;
			z-index: 1000;
			border-top-left-radius: 0.06rem;
			border-top-right-radius: 0.06rem;
			display: flex;
			padding: 0.2rem 0.15rem;
			box-sizing: border-box;
			margin-bottom: 0.2rem;
		}

		.user-info .user-left-img {
			margin-right: 0.1rem;
		}

		.user-info .user-left-img img {
			width: 0.54rem;
			height: 0.54rem;
			border-radius: 50%;
		}

		.user-info .user-mid-name {
			margin-right: auto;
		}

		.user-info .user-mid-name .username {
			font-size: 0.18rem;
			font-weight: 500;
			color: rgba(77, 77, 77, 1);
			line-height: 0.25rem;
			margin-bottom: 0.05rem;
		}

		.user-info .user-mid-name .grade {
			padding: 0.01rem 0.05rem;
			font-size: 0.13rem;
			font-weight: 400;
			color: rgba(0, 90, 147, 1);
			line-height: 0.18rem;
			background: rgba(0, 90, 147, 0.11);
			border-radius: 0.04rem;
			display: inline-block;
		}

		.user-info .user-right-arrow {
			width: 0.25rem;
			height: 0.25rem;
			align-self: center;
		}

		.user-info .user-right-arrow img {
			width: 0.25rem;
			height: 0.25rem;
		}

		.my-order {
			display: flex;
			justify-content: space-between;
			padding: 0 0.15rem;
			align-items: center;
			margin-bottom: 0.15rem;
		}

		.my-order .order-title {
			font-size: 0.16rem;
			font-weight: 500;
			color: rgba(77, 77, 77, 1);
			line-height: 0.22rem;
		}

		.my-order .show-all {
			display: flex;
			align-items: center;
			font-size: 0.12rem;
			font-weight: 400;
			color: rgba(128, 128, 128, 1);
			line-height: 0.17rem;
		}

		.my-order .show-all img {
			width: 0.25rem;
			height: 0.25rem;
		}

		.order-tabs-wraper {
			display: flex;
			padding: 0 0.17rem;
			justify-content: space-between;
			padding-bottom: 0.15rem;
			border-bottom: 0.1rem solid #f0f1f2;
		}

		.order-tabs-wraper .item {
			display: flex;
			flex-direction: column;
			align-items: center;
			font-size: 0.13rem;
			font-weight: 400;
			color: rgba(77, 77, 77, 1);
			line-height: 0.18rem;
		}

		.order-tabs-wraper img {
			width: 0.34rem;
			height: 0.34rem;
			margin-bottom: 0.02rem;
		}

		.more-tabs-wraper {
			border-bottom: 0.1rem solid #f0f1f2;
		}

		.more-tabs-wraper .title {
			font-size: 0.16rem;
			font-weight: 500;
			color: rgba(77, 77, 77, 1);
			line-height: 0.22rem;
			padding: 0.15rem;
			padding-bottom: 0.1rem;
		}

		.more-tabs-wraper .item-wraper1 {
			padding: 0;
		}

		.more-tabs-wraper .item-wraper2 {
			padding: 0;
		}

		.more-tabs-wraper .item-wraper {
			display: flex;
			flex-wrap: wrap;
			justify-content: flex-start;
			margin-bottom: 0.15rem;
			align-items: center;
			width: 100%
		}

		.more-tabs-wraper .item-wraper .item {
			font-size: 0.13rem;
			margin-bottom: 0.02rem;
			font-weight: 400;
			color: rgba(77, 77, 77, 1);
			line-height: 0.18rem;
			display: flex;
			flex-direction: column;
			align-items: center;
		}

		.more-tabs-wraper .item-wraper .item {
			width: 25%;
		}

		.more-tabs-wraper .item-wraper .item img {
			width: 0.34rem;
			height: 0.34rem;
		}

		.footer-item-wraper {
			padding: 0 0.15rem;
		}

		.footer-item-wraper .item {
			display: flex;
			justify-content: space-between;
			align-items: center;
			font-size: 0.15rem;
			font-weight: 400;
			color: rgba(77, 77, 77, 1);
			line-height: 0.21rem;
			padding: 0.18rem 0;
			border-bottom: 1px solid #e6e6e6;
		}

		.footer-item-wraper .item img {
			width: 0.25rem;
			height: 0.25rem;
		}
		/* .more-tabs-wraper .item-wraper .item div{background:red} */

		.orderoNum {
			width: 0.15rem;
			height: 0.15rem;
			background-color: red;
			position: absolute;
			border-radius: 50%;
			display: flex;
			justify-content: center;
			align-content: center;
			top: 0;
			right: 0;
		}

		.orderoNum span {
			/* display: block; */
			color: white;
			font-weight: 600;
			font-size: 0.1rem;
			line-height: 0.17rem;
		}
	</style>
</head>

<body>

	<div id="app" v-cloak="">

		<div class="bg-my" id="aui-header" style="padding-top:35px;">
			<!--  -->
			<header class="navbar">
				<div class="title">我的</div>
				<!-- 消息提示 -->
				<div class="news-tip" tapmode onclick="is_login('my_message','my/my_message.html',false)">
					<div class="news-wraper">
						<img src="../image/icons/news.png" alt />
						<template v-if="unread_msg_num > 0">
					<div class="red-tips"></div>
				</template>
					</div>
				</div>
			</header>
			<!--  -->
		</div>

		<!-- 个人信息框 -->
		<div class="user-info" onclick="is_login('my_porsen','my/my_porsen.html',false)">
			<div class="user-left-img">
				<img :src="avatar" alt />
			</div>
			<div class="user-mid-name">
				<div class="username" v-html="nickname"></div>
				<div class="grade" v-if="is_agent=='1'">代理商会员</div>
				<div class="grade" v-text="level" v-else></div>
			</div>
			<div class="user-right-arrow">
				<img src="../image/icons/arrow_right.png" alt />
			</div>
		</div>
		<!-- 我的订单 -->
		<div class="my-order">
			<div class="order-title">我的订单</div>
			<div class="show-all">
				<div class="show-all-title" @click="openWin_order_list('all')">查看全部</div>
				<div class="show-all-arrow">
					<img src="../image/icons/arrow_right.png" alt />
				</div>
			</div>
		</div>
		<!-- 待审核、待支付等 -->
		<div class="order-tabs-wraper">
			<!-- <div class="item" v-if="is_agent=='1'" @click="openWin_order_list(0)">
				<img src="../image/icons/order1.png" alt />
				<div>待审核</div>
			</div> -->

			<div class="item" @click="openWin_order_list(0)" style="position:relative">
				<img src="../image/icons/order2.png" alt />
				<div>待支付</div>
				<div class="orderoNum" v-if="vm.unpaid > 1 || vm.unpaid == 1">
					<span>{{unpaid}}</span>
				</div>
			</div>

			<div class="item" @click="openWin_order_list(10)" style="position:relative">
				<img src="../image/icons/order3.png" alt />
				<div>待发货</div>
				<div class="orderoNum" v-if="vm.unpend > 1 || vm.unpend == 1">
					<span>{{unpend}}</span>
				</div>
			</div>

			<div class="item" @click="openWin_order_list(20)" style="position:relative">
				<img src="../image/icons/order4.png" alt />
				<div>待收货</div>
				<div class="orderoNum" v-if="vm.pending > 1 || vm.pending == 1">
					<span>{{pending}}</span>
				</div>
			</div>

			<div class="item" @click="openWin_order_list(30)" style="position:relative">
				<img src="../image/icons/order5.png" alt />
				<div>待评价</div>
				<div class="orderoNum" v-if="vm.unevaluated > 1 || vm.unevaluated == 1">
					<span>{{unevaluated}}</span>
				</div>
			</div>
		</div>
		<!-- 更多 -->
		<div class="more-tabs-wraper">
			<div class="title">更多</div>
			<div class="item-wraper item-wraper1">
				<div class="item" tapmode onclick="open_win('publish', './my/publish/publish.html', false)">
					<img src="../image/icons/more1.png" alt />
					<div class="fs">发布会员秀</div>
				</div>

				<!-- <div class="item" tapmode @click="open_win('my_members', './my/my_members.html', false,{is_agent:is_agent})">
					<img src="../image/icons/more2.png" alt />
					<div>我的会员</div>
				</div> -->

				<div class="item" onclick="is_login('my_fav','./my/my_fav.html',false)">
					<img src="../image/icons/more5.png" alt />
					<div>我的收藏</div>
				</div>

				<div class="item" tapmode onclick="open_win('my_group', './my/order/pintuan.html', false)">
					<img src="../image/icons/more3.png" alt />
					<div>我的拼团</div>
				</div>

				<div class="item" tapmode onclick="is_login('my_coupons','./my/my_coupons.html',false)">
					<img src="../image/icons/more4.png" alt />
					<div>优惠券</div>
				</div>
			</div>

			<div class="item-wraper item-wraper2">
				
				<div class="item" onclick="is_login('my_evaluate','./my/my_evaluate.html',false)">
					<img src="../image/icons/more6.png" alt />
					<div>我的评价</div>
				</div>

				<div class="item" onclick="is_login('address_list','widget://html/my/address_list.html',false)">
					<img src="../image/icons/more7.png" alt />
					<div>我的地址</div>
				</div>

				<div class="item" tapmode onclick="is_login('my_account','./my/my_account.html',false)">
					<img src="../image/icons/more68.png" alt />
					<div>账号管理</div>
				</div>

				<div class="item" onclick="open_win('my_vcharts', './my/my_vcharts.html', false)">
					<img src="../image/icons/more9.png" alt />
					<div>数据统计</div>
				</div>
			</div>
			<div class="item-wraper item-wraper2">
				

				<div class="item" onclick="is_login('ticket_list','./my/ticket_list.html',false)">
					<img src="../image/icons/more10.png" alt />
					<div>我的发票</div>
				</div>

				<div class="item" onclick="open_win('my_members', './my/my_members.html', false)">
					<img src="../image/icons/more11.png" alt />
					<div>我的资金</div>
				</div>

				<div class="item"  onclick="open_win('user_payment', './recharge/index.html', false)">
					<img src="../image/icons/more18.png" alt />
					<div>余额充值</div>
				</div>

				<div class="item"onclick="open_win('store_list', './my/store_list.html', false)">
					<img src="../image/icons/more12.png" alt />
					<div>联系我们</div>
				</div>

			</div>
			<div class="item-wraper item-wraper2">

				<!-- <div class="item" onclick="open_win('goods_score', './goods/goods_score.html', false)">
					<img src="../image/icons/more13.png" alt />
					<div>积分商城</div>
				</div> -->

				<div class="item" onclick="open_win('my_gold', './my/my_gold.html', false)">
					<img src="../image/icons/more13.png" alt />
					<div>我的金币</div>
				</div>

				<div class="item" onclick="open_win('my_score', './my/my_score.html', false)">
					<img src="../image/icons/more14.png" alt />
					<div>我的积分</div>
				</div>

				<!-- <div class="item" onclick="openWin_score_order_list(10)">
					<img src="../image/icons/more15.png" alt />
					<div>积分订单</div>
				</div> -->

				<div class="item" onclick="open_win('my_score', './score/index.html', false)">
					<img src="../image/icons/more16.png" alt />
					<div>每日签到</div>
				</div>

				<div class="item"  onclick="openSharebox()">
					<img src="../image/icons/more17.png" alt />
					<div>分享APP</div>
				</div>


			</div>

	</div>
	<!-- 底部亲人生日管理等 -->
	<div class="footer-item-wraper">
		<div class="item" onclick="open_win('my_birthdaytip', './my/my_birthdaytip.html', false)">
			<div class="left">亲人生日管理</div>
			<img src="../image/icons/arrow_right.png" alt />
		</div>

		<div class="item" onclick="is_login('question','./my/question.html',false)">
			<div class="left">常见问题</div>
			<img src="../image/icons/arrow_right.png" alt />
		</div>

		<div class="item" onclick="is_login('set_up','./my/set_up.html',false)">
			<div class="left">设置</div>
			<img src="../image/icons/arrow_right.png" alt />
		</div>

		<!-- <div class="item" onclick="open_win('my_vcharts', './my/my_vcharts.html', false)">
				<div class="left">图表</div>
				<img src="../image/icons/arrow_right.png" alt />
			</div> -->
	</div>

	</div>
</body>
<script type="text/javascript" src="../script/api.js"></script>
<script type="text/javascript" src="../script/vue.js"></script>
<script type="text/javascript" src="../script/common.js"></script>
<script>
	var vm = new Vue({
		el: '#app',
		data: {
			nickname: '请登录',
			remark: '无',
			avatar: '../image/icon/avatar.png',
			level: '游客',
			unread_msg_num: 0,
			kefu_phone: '400000000',
			unpaid: 0,
			unpend: 0,
			pending: 0,
			unevaluated: 0,
			afterService: 0,
			gold: 0,
			is_agent: 0,
		},
		methods: {
			get_userinfo: function() {
				get_data('api/user/getUserInfo', {
					token: $api.getStorage('token')
				}, function(ret) {
					// alert(JSON.stringify(ret,null,2))
					// alert(JSON.stringify(ret))
					console.log(JSON.stringify(ret.data));
					if (ret.status) {
						save_userinfo_new(ret)
						vm.nickname = ret.data.nickname == '' ? '未设置昵称' : ret.data.nickname;
						vm.remark = ret.data.remark == '' ? '未设置个人简介' : ret.data.remark;
						vm.avatar = ret.data.avatar ? ret.data.avatar : vm.avatar;
						vm.level = ret.data.user_level_name;
						vm.unread_msg_num = ret.data.unread_msg_num;
						vm.unpaid = ret.data.unpaid;
						vm.unpend = ret.data.unpend;
						vm.pending = ret.data.pending;
						vm.unevaluated = ret.data.unevaluated;
						vm.afterService = ret.data.afterService;
						vm.gold = ret.data.gold;
						vm.is_agent = ret.data.is_agent;
					}

				}, false)
			},
			get_kefu_phone: function() {
				get_data('api/System/sysInfo', {}, function(ret) {
					if (ret.status) {
						vm.kefu_phone = ret.data.kefu_phone
					}
				}, false)
			}
		}
	})
	apiready = function() {

		// $api.fixStatusBar($api.byId('app'))

		var header = document.querySelector('#aui-header');
		$api.fixStatusBar(header);

		vm.get_userinfo();


		add_event('logined', function(ret) {
			vm.get_userinfo();
		})
		add_event('read_msg_all', function(ret) {
				vm.unread_msg_num = 0
			})
			// add_event('read_msg_all', function(ret) {
			// 	vm.unread_msg_num = 0
			// })
		add_event('loginout', function(ret) {
			vm.nickname = '请登录';
			vm.avatar = '../image/icon/avatar.png';
			vm.level = '';
			vm.unpaid = 0;
			vm.unpend = 0;
			vm.pending = 0;
			vm.unevaluated = 0;
			vm.afterService = 0;
		})
		vm.get_kefu_phone()
		setTimeout(function() {
			$api.setStorage('is_agent', vm.is_agent);
			api.setPrefs({
				key: 'is_agent',
				value: vm.is_agent
			});
		}, 800)

	};

	function openSharebox() {
		/*
		{
			image: '../../image/btn/face-to-face.png',
			text: '面对面扫描',
			value: 'face-to-face'
		}
		*/
		if (!$api.getStorage('token')) {
			openWin_login()
			return;
		}
		var dialogBox = api.require('dialogBox');
		// {
		//         text: '',
		//         icon: 'widget://image/btn/weibo.png'
		//     }, 
		dialogBox.share({
			  tapClose: true,
		    rect: {
		        w: 300,
		        h: 300
		    },
		    items: [{
		        text: '朋友圈',
		        icon: 'widget://image/btn/Space.png'
		    }, {
		        text: '微信好友',
		        icon: 'widget://image/btn/friends.png'
		    },{
		        text: 'QQ空间',
		        icon: 'widget://image/btn/qq-space.png'
		    }, {
		        text: 'QQ好友',
		        icon: 'widget://image/btn//qq-friends.png'
		    }],
		    styles: {
		        bg: '#FFF',
		        column: 3,
		        horizontalSpace: 15,
		        verticalSpace: 30,
		        itemText: {
		            color: '#000',
		            size: 15,
		            marginT: 10
		        },
		        itemIcon: {
		            size: 60
		        }
		    }
		}, function(ret) {
		    // alert(JSON.stringify(ret));
				if (ret.index == 0) {
					shareTowx('timeline')
				}
				if (ret.index == 1) {
					shareTowx('session')
				}
				if (ret.index == 2) {
					shareTowb()
				}
				if (ret.index == 3) {
					shareQQ('QZone')
				}
				if (ret.index == 4) {
					shareQQ('QFriend')
				}
		});

		// var sharebox = new auiSharebox();
		// sharebox.init({
		// 	frameBounces: true, //当前页面是否弹动，（主要针对安卓端）
		// 	buttons: [{
		// 		image: '../../image/btn/Space.png',
		// 		text: '朋友圈',
		// 		value: 'wx'
		// 	}, {
		// 		image: '../../image/btn/friends.png',
		// 		text: '微信好友',
		// 		value: 'wx-circle' //可选
		// 	}, {
		// 		image: '../../image/btn/weibo.png',
		// 		text: '新浪',
		// 		value: 'weibo'
		// 	}, {
		// 		image: '../../image/btn/qq-space.png',
		// 		text: 'QQ空间',
		// 		value: 'qq-space'
		// 	}, {
		// 		image: '../../image/btn/qq-friends.png',
		// 		text: 'QQ好友',
		// 		value: 'qq-friends'
		// 	}],
		// 	// ,
		// 	// {
		// 	// 	image: '../../image/btn/face-to-face.png',
		// 	// 	text: '面对面扫描',
		// 	// 	value: 'face-to-face'
		// 	// }],
		// 	col: 3,
		// 	shareTitle: '分享到', //可选,当然也可以采用下面的方式使用图标
		// 	cancelTitle: '取消'
		// }, function (ret) {
		// 	if (ret) {
		// 		console.log(ret.buttonIndex + '/' + ret.buttonValue)
		// 		if (ret.buttonIndex == 1) {
		// 			shareTowx('timeline')
		// 		}
		// 		if (ret.buttonIndex == 2) {
		// 			shareTowx('session')
		// 		}
		// 		if (ret.buttonIndex == 3) {
		// 			shareTowb()
		// 		}
		// 		if (ret.buttonIndex == 4) {
		// 			shareQQ('QZone')
		// 		}
		// 		if (ret.buttonIndex == 5) {
		// 			shareQQ('QFriend')
		// 		}
		// 	}
		// })
	}

	function shareTowx(type) {
		var contentUrl = 'https://zm.zonmay.com/wap/share/download.html'
		var title = '分享一款超有趣的APP'
		var wx = api.require('wxPlus');
		wx.isInstalled(function (ret, err) {
			if (ret.installed) {} else {
				toast('当前设备未安装微信客户端');
				return;
			}
		});
		wx.shareWebpage({
			scene: type,
			title: title,
			description: title,
			contentUrl: contentUrl,
			thumb: 'http://zm.zonmay.com/public/logo.png'
		}, function (ret, err) {
			if (ret.status) {
				toast('分享成功');
				get_data('api/user/shareTakeGold', {
					token: $api.getStorage('token')
				}, function (ret) {
					if (ret.status) {
						vm.share_gold = ret.data.gold
						vm.share_show = true
						setTimeout(function () {
							vm.share_show = false
						}, 300000)
					}
				})
			} else {
				if (err.code == '2') {
					toast('取消分享');
				}
				console.log(err.code);
			}
		});
	}

	function shareTowb() {
		var contentUrl = 'https://zm.zonmay.com/wap/share/download.html'
		var title = '分享一款超有趣的APP'
		var weibo = api.require('weiboPlus');
		weibo.shareWebPage({
			text: title + '。详情点击链接查看',
			title: title,
			description: title,
			thumb: 'http://zm.zonmay.com/public/logo.png',
			contentUrl: contentUrl
		}, function (ret, err) {
			console.log(JSON.stringify(ret))
			if (ret.status) {
				toast('分享成功');
				get_data('api/user/shareTakeGold', {
					token: $api.getStorage('token')
				}, function (ret) {
					if (ret.status) {
						vm.share_gold = ret.data.gold
						vm.share_show = true
						setTimeout(function () {
							vm.share_show = false
						}, 300000)
					}
				})
			} else {
				if (err.code == '1') {
					toast('取消分享');
				}
				console.log(JSON.stringify(err))
			}
		});
	}

	function share_show_hide() {
		vm.share_show = false;
	}

	function shareQQ(type) {
		//alert(type)
		var qq = api.require('QQPlus');
		qq.installed(function (ret, err) {
			if (ret.status) {} else {
				api.alert({
					msg: "没有安装QQ"
				});
			}
		});
		var contentUrl = 'https://zm.zonmay.com/wap/share/download.html'
		var title = '分享一款超有趣的APP'
		qq.shareNews({
			url: contentUrl,
			title: title,
			description: title,
			imgUrl: 'http://zm.zonmay.com/public/logo.png',
			type: type
		}, function (ret, err) {
			//alert(JSON.stringify(err))
			if (ret.status) {
				alert("分享成功！");
				get_data('api/user/shareTakeGold', {
					token: $api.getStorage('token')
				}, function (ret) {
					if (ret.status) {
						vm.share_gold = ret.data.gold
						vm.share_show = true
						setTimeout(function () {
							vm.share_show = false
						}, 300000)
					}
				})
			} else {
				api.alert({
					msg: '取消分享'
				});
			}
		});
	}

	function is_login(name, url, status) {
		if (vm.nickname == '请登录') {
			openWin_login();
			return;
		} else {
			open_win(name, url, status)
		}
	}

	function is_login_order(index) {
		if (vm.nickname == '请登录') {
			openWin_login();
			return;
		} else {
			openWin_order_list(index)
		}
	}
</script>

</html>
